<template>
	<view class="list">
		<view class="customer">
			{{entity.cCusName}}
		</view>
		<view class="cItem" v-for="item in data" :key="item.Id">
			<view class="billId">
				订单号: {{item.Id}}
				<uni-tag class="tag" v-if="item.IsReconcile" text="已对账" type="success"></uni-tag>
			</view>
			<view class="line">
				<view class="cell">
					<view class="lable">发货日期</view>{{item.CreateTime?item.CreateTime.substring(0,10):''}}
				</view>
				<view class="cell">
					<view class="lable">应付金额</view>{{momenyFormat(item.TotalSum)}}
				</view>
			</view>
			<view class="line">
				<view class="cell">
					<view class="lable">已付金额</view>{{momenyFormat(item.ReceiveSum)}}
				</view>
				<view class="cell">
					<view class="lable">余欠金额</view>{{momenyFormat(item.OutstandingSum)}}
				</view>
			</view>
			<!-- <view class="line">
				<view class="cell">

				</view>
				<view class="cell">
					<text @click="">微信对账</text>
					<text @click="">短信对账</text>
				</view>
			</view> -->
		</view>
	</view>
</template>

<script>
	import {
		momenyFormat
	} from '@/util/util.js'
	export default {
		data() {
			return {
				entity: {},
				data: [],
				pagination: {
					PageIndex: 1,
					PageRows: 10,
					SortField: "CreateTime",
					SortType: "desc",
				},
				total: 0,
			}
		},
		onLoad(query) {
			console.log(query);
			uni.setNavigationBarTitle({
				title: query.key
			})
			this.entity = JSON.parse(query.data)
			this.getDataList()
		},
		methods: {
			getDataList() {
				this.$http('post', '/BO/BIlling/GetOwingbBlling', {
					...this.pagination,
					Search: {
						customId: this.entity.CustomerId
					}
				}).then(res => {
					console.log(res);
					if (!res.Success) return this.$api.msg(res.Msg)
					this.data = res.Data
					this.total = res.total
				})
			},
			// 千分位
			momenyFormat(num) {
				return momenyFormat(num)
			}
		}
	}
</script>

<style scoped lang="scss">
	.list {
		padding: 10px;

		.customer {
			font-weight: bold;
			margin-bottom: 10px;
		}

		.cItem {
			background-color: #aae3f9;
			border-radius: 10px;
			box-sizing: border-box;
			font-weight: 600;
			padding: 15rpx;
			margin-bottom: 20rpx;
			position: relative;

			.billId {
				.tag {
					position: absolute;
					top: 0;
					right: 0;
				}
			}

			.line {
				display: flex;
				height: 60rpx;
				align-items: end;

				.cell {
					flex: 1;
					display: flex;
					justify-content: space-between;
					margin-right: 20rpx;

					.lable {
						width: 60px;
						font-weight: normal;
					}

					text {
						flex: 1;
						color: blue;
					}
				}
			}
		}
	}
</style>